<template>
  <div>
          <!-- 
            :checkStrictly="true" ，父节点选中将不影响子节点选中状态
            autoExpandParent="true",是否展开父节点
             -->
          <a-tree 
          checkable
          :selectable="false"
          :checkStrictly="true"
          :selectedKeys="selectedKeys"
          :checkedKeys="treeData"
          v-model="treeData"
          :replaceFields="replaceFields"
          :tree-data="treeData"
          :defaultExpandAll="true"
          :autoExpandParent="true"
           />
  </div>
</template>
<script>
const treeData = [
  {
    name: '类别1',
    key: '1',
    child: [
      {
        name: '张晨成',
        key: '1-1',
        child: [
          { name: 'leaf', key: '1-1-0',  },
          { name: 'leaf', key: '1-1-1' },
        ],
      },
      {
        name: 'parent 1-1',
        key: '1-2',
        child: [{ key: '1-2-1', name: 'zcvc' }],
      },
    ],
  },
   {
    name: '类别2',
    key: '2',
    child: [
      {
        name: '张晨成',
        key: '2-1',
        child: [
          { name: 'leaf', key: '2-1-1',  },
          { name: 'leaf', key: '2-1-2' },
        ],
      },
      {
        name: 'parent 1-1',
        key: '2-2',
        child: [{ key: '2-2-1', name: 'zcvc' }],
      },
    ],
  },
];
export default {
  name: '',
  props: {
  },
  components: {},
  data() {
    return {
      treeData,
      replaceFields: {
        children: 'child',
        title: 'name',
      },
    };
  },
  methods: {
    onSelect(selectedKeys, info) {
      console.log('selected', selectedKeys, info);
    },
    onCheck(checkedKeys, info) {
      console.log('onCheck', checkedKeys, info);
    },
  },
  computed: {},
  watch: {},
  created() {
  },
  mounted() {
  },
};
</script>
<style scoped lang='less'>
</style>